<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <title></title>
    <meta charset="utf-8" />
    <style>
        #gggg ul {
            display: none;
        }
    </style>
</head>
<body>
<div id="bbbb"></div>
<script>
    (function ($) {
        $.fn.AddSelect = function (opation) {
            var _arg = $.extend({
                data: ""
                , id: "a"
                , name: "b"
                , link: "c"
            }, opation);
            var _this1 = this;
            if (_arg.data) {
                var _dt = _arg.data,_a = _arg.id,_b=_arg.name,_c=_arg.link;
                var _html = "";
                var _prams = []
                _prams[0] = _dt;
                _html += '<select>'; //初级设置
                _html += '<option>请选择</option>';
                for (var i = 0; i < _dt.length; i++) {
                    _html += '<option value="' + _dt[i][_a] + '|' + (_dt[i][_c] == null ? null : i) + '">' + _dt[i][_b] + '</option>';
                }
                _html += '</select>';
                $(_this1).html(_html);
                function _select1() {
                    $(_this1).children("select").change(function () {
                        var _this2 = this;
                        var _val = $(_this2).val().split("|")[1];
                        $(_this2).nextAll("select").remove();
                        if (_val % 1 == 0) {
                            var _index = $(_this2).index();
                            var _str = "";
                            _prams[_index + 1] = _prams[_index][_val][_c];//一条线放一个数组 不同线重置
                            //console.log(_prams[_index + 1])
                            _str += '<select>';
                            _str += '<option>请选择</option>';
                            for (var i = 0; i < _prams[_index + 1].length; i++) {
                                _str += '<option value="' + _prams[_index + 1][i][_a] + '|' + (_prams[_index + 1][i][_c] == null ? null : i) + '">' + _prams[_index + 1][i][_b] + '</option>';
                            }
                            _str += '</select>';
                            $(_this2).after(_str);
                            $(_this1).children("select").unbind("change");
                            _select1();
                        }
                    })
                }
                _select1();
            }
        }
    })(jQuery)

    var _json = [
        {
            "v": "1",
            "n": "这里是多级",
            "s": [{
                "v": "3",
                "n": "第二级",
                "s": [
                    {
                        "v": "8",
                        "n": "第三级",
                        "s": [
                            {
                                "v": "9",
                                "n": "有一分耕耘"
                            }
                        ]
                    }
                ]
            },
                {
                    "v": "4",
                    "n": "新闻一级1",
                    "s": [
                        {
                            "v": "10",
                            "n": "55",
                            "s": [
                                {
                                    "v": "11",
                                    "n": "551",
                                    "s": [
                                        {
                                            "v": "13",
                                            "n": "321"
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                },
                {
                    "v": "5",
                    "n": "动态一"
                }
            ]
        },
        {
            "v": "2",
            "n": "文章",
            "s": [
                {
                    "v": "7",
                    "n": "6666"
                }
            ]
        },
        {
            "v": "6",
            "n": "哈哈哈"
        },
        {
            "v": "12",
            "n": "12"
        }
    ];


    //$("#gggg").AddTree({
    //    data: _json
    //})
    $("#bbbb").AddSelect({
        data: _json
        , id: "v"
        , name: "n"
        , link: "s"
    })
</script>
</body>
</html>
